/* hand craft some css icon so that we do not have to use icon font */
.icon {
	display: inline-block;
	vertical-align: middle;
	position: relative;
	&:before, &:after {
		background-color: #666;
	}
}
.icon.white {
	&:before, &:after {
		background-color: white;
	}
}

.plus {
	&:before, &:after {
		content: '';
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
	}
	&:before {
		width: 1rem;
		height: 2px;
	}
	&:after {
		width: 2px;
		height: 1rem;
	}
}
.minus {
	&:before, &:after {
		content: '';
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
	}
	&:before {
		width: 1rem;
		height: 2px;
	}
}

.left {
	&:before, &:after {
		content: '';
		position: absolute;
		width: 1rem;
		height: 2px;
		left: 2px;
		top: 0;
		bottom:0;
		margin:auto 0;
		transform-origin:left;
	}
	&:before {
		transform: rotate(45deg)
	}
	&:after {
		transform: rotate(-45deg)
	}
}